<template>
  <div>
    <van-nav-bar
      title="求购"
      left-arrow
      @click-left="onClickLeft"
      line-width="70"
      style="position:relative"
    />
    <div>
      <van-tabs v-model="active">
        <van-tab title="全部">
          <ul style="overflow:auto;height:12rem;" class="list">
            <li>
              <div class="user1">
                <div style="display:flex;">
                  <router-link to="/pingjia" class="pimg" tag="p"></router-link>
                  <p
                    style="display:flex;flex-direction: column;justify-content: space-between;height:1rem"
                  >
                    <span>大牛</span>
                    <span>2019-05-18</span>
                  </p>
                </div>
                <span style="margin-top:0.4rem">古驰</span>
              </div>
              <p>请大神鉴定</p>

              <div class="user2">
                <img
                  src="https://img03.sogoucdn.com/net/a/04/link?url=https%3A%2F%2Fi03piccdn.sogoucdn.com%2F09cb70ea31abfcfc&appid=122"
                />
                <img
                  src="https://img03.sogoucdn.com/net/a/04/link?url=https%3A%2F%2Fi03piccdn.sogoucdn.com%2F09cb70ea31abfcfc&appid=122"
                />
                <img
                  src="https://img03.sogoucdn.com/net/a/04/link?url=https%3A%2F%2Fi03piccdn.sogoucdn.com%2F09cb70ea31abfcfc&appid=122"
                />
                <img
                  src="https://img03.sogoucdn.com/net/a/04/link?url=https%3A%2F%2Fi03piccdn.sogoucdn.com%2F09cb70ea31abfcfc&appid=122"
                />
                <img
                  src="https://img03.sogoucdn.com/net/a/04/link?url=https%3A%2F%2Fi03piccdn.sogoucdn.com%2F09cb70ea31abfcfc&appid=122"
                />
                <img
                  src="https://img03.sogoucdn.com/net/a/04/link?url=https%3A%2F%2Fi03piccdn.sogoucdn.com%2F09cb70ea31abfcfc&appid=122"
                />
              </div>
            </li>
            <li>
              <div class="user1">
                <div style="display:flex;">
                  <p class="pimg"></p>
                  <p
                    style="display:flex;flex-direction: column;justify-content: space-between;height:1rem"
                  >
                    <span>大牛</span>
                    <span>2019-05-18</span>
                  </p>
                </div>
                <span style="margin-top:0.4rem">古驰</span>
              </div>
              <p>请大神鉴定</p>

              <div class="user2">
                <img
                  src="https://img03.sogoucdn.com/net/a/04/link?url=https%3A%2F%2Fi03piccdn.sogoucdn.com%2F09cb70ea31abfcfc&appid=122"
                />
                <img
                  src="https://img03.sogoucdn.com/net/a/04/link?url=https%3A%2F%2Fi03piccdn.sogoucdn.com%2F09cb70ea31abfcfc&appid=122"
                />
                <img
                  src="https://img03.sogoucdn.com/net/a/04/link?url=https%3A%2F%2Fi03piccdn.sogoucdn.com%2F09cb70ea31abfcfc&appid=122"
                />
                <img
                  src="https://img03.sogoucdn.com/net/a/04/link?url=https%3A%2F%2Fi03piccdn.sogoucdn.com%2F09cb70ea31abfcfc&appid=122"
                />
                <img
                  src="https://img03.sogoucdn.com/net/a/04/link?url=https%3A%2F%2Fi03piccdn.sogoucdn.com%2F09cb70ea31abfcfc&appid=122"
                />
                <img
                  src="https://img03.sogoucdn.com/net/a/04/link?url=https%3A%2F%2Fi03piccdn.sogoucdn.com%2F09cb70ea31abfcfc&appid=122"
                />
              </div>
            </li>
            <li>
              <div class="user1">
                <div style="display:flex;">
                  <p class="pimg"></p>
                  <p
                    style="display:flex;flex-direction: column;justify-content: space-between;height:1rem"
                  >
                    <span>大牛</span>
                    <span>2019-05-18</span>
                  </p>
                </div>
                <span style="margin-top:0.4rem">古驰</span>
              </div>

              <p>请大神鉴定</p>
              <div class="user2">
                <img
                  src="https://img03.sogoucdn.com/net/a/04/link?url=https%3A%2F%2Fi03piccdn.sogoucdn.com%2F09cb70ea31abfcfc&appid=122"
                />
                <img
                  src="https://img03.sogoucdn.com/net/a/04/link?url=https%3A%2F%2Fi03piccdn.sogoucdn.com%2F09cb70ea31abfcfc&appid=122"
                />
                <img
                  src="https://img03.sogoucdn.com/net/a/04/link?url=https%3A%2F%2Fi03piccdn.sogoucdn.com%2F09cb70ea31abfcfc&appid=122"
                />
                <img
                  src="https://img03.sogoucdn.com/net/a/04/link?url=https%3A%2F%2Fi03piccdn.sogoucdn.com%2F09cb70ea31abfcfc&appid=122"
                />
                <img
                  src="https://img03.sogoucdn.com/net/a/04/link?url=https%3A%2F%2Fi03piccdn.sogoucdn.com%2F09cb70ea31abfcfc&appid=122"
                />
                <img
                  src="https://img03.sogoucdn.com/net/a/04/link?url=https%3A%2F%2Fi03piccdn.sogoucdn.com%2F09cb70ea31abfcfc&appid=122"
                />
              </div>
            </li>
            <li>
              <div class="user1">
                <div style="display:flex;">
                  <p class="pimg"></p>
                  <p
                    style="display:flex;flex-direction: column;justify-content: space-between;height:1rem"
                  >
                    <span>大牛</span>
                    <span>2019-05-18</span>
                  </p>
                </div>
                <span style="margin-top:0.4rem">古驰</span>
              </div>
              <p>请大神鉴定</p>

              <div class="user2">
                <img
                  src="https://img03.sogoucdn.com/net/a/04/link?url=https%3A%2F%2Fi03piccdn.sogoucdn.com%2F09cb70ea31abfcfc&appid=122"
                />
                <img
                  src="https://img03.sogoucdn.com/net/a/04/link?url=https%3A%2F%2Fi03piccdn.sogoucdn.com%2F09cb70ea31abfcfc&appid=122"
                />
                <img
                  src="https://img03.sogoucdn.com/net/a/04/link?url=https%3A%2F%2Fi03piccdn.sogoucdn.com%2F09cb70ea31abfcfc&appid=122"
                />
                <img
                  src="https://img03.sogoucdn.com/net/a/04/link?url=https%3A%2F%2Fi03piccdn.sogoucdn.com%2F09cb70ea31abfcfc&appid=122"
                />
                <img
                  src="https://img03.sogoucdn.com/net/a/04/link?url=https%3A%2F%2Fi03piccdn.sogoucdn.com%2F09cb70ea31abfcfc&appid=122"
                />
                <img
                  src="https://img03.sogoucdn.com/net/a/04/link?url=https%3A%2F%2Fi03piccdn.sogoucdn.com%2F09cb70ea31abfcfc&appid=122"
                />
              </div>
            </li>
          </ul>
        </van-tab>
        <van-tab title="名包">
          <div style="height:14rem;overflow:auto">
            <van-card
              v-for="item1 in list"
              :price="item1.platformPrice"
              :desc="item1.goodsDetail"
              :title="item1.goodsName"
              :thumb="item1.imageUrl"
              @click="tap(item1.goodsId)"
            />
          </div>
        </van-tab>
        <van-tab title="名表" @click="tab()">
          <div style="height:14rem;overflow:auto">
            <van-card
              v-for="item1 in list"
              :price="item1.platformPrice"
              :desc="item1.goodsDetail"
              :title="item1.goodsName"
              :thumb="item1.imageUrl"
              @click="tap(item1.goodsId)"
            />
          </div>
        </van-tab>
        <van-tab title="饰品">
          <div style="height:14rem;overflow:auto">
            <van-card
              v-for="item1 in list"
              :price="item1.platformPrice"
              :desc="item1.goodsDetail"
              :title="item1.goodsName"
              :thumb="item1.imageUrl"
              @click="tap(item1.goodsId)"
            />
          </div>
        </van-tab>
        <van-tab title="名鞋">
          <div style="height:14rem;overflow:auto">
            <van-card
              v-for="item1 in list"
              :price="item1.platformPrice"
              :desc="item1.goodsDetail"
              :title="item1.goodsName"
              :thumb="item1.imageUrl"
              @click="tap(item1.goodsId)"
            />
          </div>
        </van-tab>
      </van-tabs>
    </div>
  </div>
</template>
<script>
import axios from "axios";
export default {
  data() {
    return {
      active: 0,
      list: [],
      img: "item.imageUrl"
    };
  },
  mounted() {
    axios({
      // url: "http://10.8.157.39:8080/secluxury/type/brandGoodsList "
      url: "http://47.102.221.184:8083/secluxury/type/brandGoodsList"
    })
      .then(data => {
        // console.log(data.data);
        var a = data.data;
        a.map(goods => {
          // console.log(goods.goodsList);
          goods.goodsList.map(yahu => {
            this.list.push(yahu);
            console.log(yahu);
            console.log(this.list);

          });
        });
      })
      .catch(err => {
        console.log(err);
      });
  },
  methods: {
    onClickLeft() {
      this.$router.go(-1);
    },
    tap(id) {
      this.$router.push("/details/" + id);
    }
  }
};
</script>
<style scoped>
.list li {
  padding: 0 0.4rem;
  height: 6rem;
  display: flex;
  display: block;
  border-bottom: 1px solid #ccc;
  margin-top: 0.5rem;
}
.user1 {
  display: flex;
  height: 1.6rem;
  justify-content: space-between;
}
.pimg {
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  background: #ccc;
  margin-right: 0.2rem;
}
.user2 {
  display: flex;
  flex-wrap: wrap;
}
.user2 img {
  height: 1.8rem;
  width: 2.9rem;
  margin-right: 0.05rem;
  margin-bottom: 0.05rem;
}
</style>
